<template>
    <div class="cx-details">
        <div class="cx-details-header">设备查看</div>
        <div class="list">
            <div>
                设备编号：{{list.equipId}}
            </div>
            <div>
                设备名称：{{list.equipName}}
            </div>
            <div>
                设备类型：{{list.equipType}}
            </div>
            <div>
                RFID编码：{{list.frid}}
            </div>
            <div>
                安装位置：{{list.equipLocation}}
            </div>
            <div>
                设备型号：{{list.equipSize}}
            </div>
            <div>
                功率(KW)：{{list.equipPower}}
            </div>
            <div>
                设备原值：{{list.equipValue}}
            </div>
            <div>
                GPS经度：{{list.equipX}}
            </div>
            <div>
                GPS纬度：{{list.equipY}}
            </div>
            <div>
                启用日期：{{list.equipUsedate}}
            </div>
            <div>
                点位编号：{{list.SiteId}}
            </div>
            <div>
                出厂日期：{{list.equipProdate}}
            </div>
            <div>
                生产厂商：{{list.equipFactory}}
            </div>
            <div>
                供货商：{{list.equipSupplier}}
            </div>
            <div>
                检修周期：{{list.equipCheckdate}}
            </div>
            <div>
                润滑周期：{{list.equipLubdate}}
            </div>
            <div>
                设备流量：{{list.equipFlow}}
            </div>
            <div>
                设备扬程：{{list.equipLeft}}
            </div>
            <div>
                设备图片：<br><img v-if="list.equipFilepath!=null" :src="list.equipFilepath" alt="" @click="clickImg($event)">
            </div>
        </div>
        <bigImg v-if="showImg" @clickit="viewImg" :imgSrc="imgSrc" />

        <button type="button" class="btn btn-block btn-primary" @click="goXiugai">编辑</button>

    </div>
</template>

<script>
import bigImg from "@/components/bigImg.vue";

export default {
    data() {
        return {
            list: {},
            showImg: false,
            imgSrc: ''
        }
    },
    components: {
        bigImg
    },
    mounted() {
        this.getEquipdetail()
    },
    methods: {
        //路由跳转
        goXiugai() {
            this.$router.push({ path: 'xiugai', query: { equipId: this.$route.query.equipId } })
        },
        //获取详情
        getEquipdetail() {
            this.$api.chaxun.equipdetail({
                equipId: this.$route.query.equipId
            }).then(res => {
                if (res.success) {
                    this.list = res.data
                }
            });
        },
        //图片放大
        viewImg() {
            this.showImg = false;
        },
        clickImg(e) {
            this.showImg = true;
            // 获取当前图片地址
            this.imgSrc = e.currentTarget.src;
        },
    }
}
</script>

<style>
</style>
